<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">

<head>
	<meta charset="utf-8" />
	<meta http-equiv="X-UA-Compatible" content="IE=9; IE=8; IE=7; IE=EDGE">
	<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />
	<title>乐优商城--商品详情页</title>
	 <link rel="icon" href="/assets/img/favicon.ico">

    <link rel="stylesheet" type="text/css" href="/css/webbase.css" />
    <link rel="stylesheet" type="text/css" href="/css/pages-item.css" />
    <link rel="stylesheet" type="text/css" href="/css/pages-zoom.css" />
    <link rel="stylesheet" type="text/css" href="/css/widget-cartPanelView.css" />

	<style type="text/css">
	.goods-intro-list li {
		display: inline-block;
		width: 300px;
	}
       .Ptable {
           margin: 10px 0;
       }
       .Ptable-item {
            padding: 12px 0;
            line-height: 220%;
            color: #999;
            font-size: 12px;
            border-bottom: 1px solid #eee;
        }
       .Ptable-item h3 {
           width: 110px;
           text-align: right;
       }
       .Ptable-item h3, .package-list h3 {
           font-weight: 400;
           font-size: 12px;
           float: left;
       }
       h3 {
           display: block;
           font-size: 1.17em;
           -webkit-margin-before: 1em;
           -webkit-margin-after: 1em;
           -webkit-margin-start: 0px;
           -webkit-margin-end: 0px;
           font-weight: bold;
       }
       .Ptable-item dl {
           margin-left: 110px;
       }
       dl {
           display: block;
           -webkit-margin-before: 1em;
           -webkit-margin-after: 1em;
           -webkit-margin-start: 0px;
           -webkit-margin-end: 0px;
       }
       .Ptable-item dt {
           width: 160px;
           float: left;
           text-align: right;
           padding-right: 5px;
       }
       .Ptable-item dd {
           margin-left: 210px;
       }
       dd {
           display: block;
           -webkit-margin-start: 40px;
       }
       .package-list {
           padding: 12px 0;
           line-height: 220%;
           color: #999;
           font-size: 12px;
           margin-top: -1px;
       }
       .package-list h3 {
           width: 130px;
           text-align: right;
       }
       .package-list p {
           margin-left: 155px;
           padding-right: 50px;
       }
		.notclick{
			pointer-events: none;
		}
</style>

</head>

<body>

<!-- 头部栏位 -->
<!--页面顶部，由js动态加载-->
<div id="itemApp">
	<div id="nav-bottom">
		<ly-top />
	</div>
	<div class="py-container">
		<div id="item">
			<div class="crumb-wrap">
				<ul class="sui-breadcrumb">
					<li th:each="category : ${categories}">
						<a href="#" th:text="${category.name}">手机</a>
					</li>
					<li>
						<a href="#" th:text="${brand.name}">Apple</a>
					</li>
					<li class="active" th:text="${spu.title}">Apple iPhone 6s</li>
				</ul>
			</div>
			<!--product-info-->
			<div class="product-info">
				<div class="fl preview-wrap">
					<!--放大镜效果-->
					<div class="zoom">
						<!--默认第一个预览-->
						<div id="preview" class="spec-preview">
							<span class="jqzoom">
								<img :jqimg="images[0]" :src="images[0]" width="400px" height="400px"/>
							</span>
						</div>
						<!--下方的缩略图-->
						<div class="spec-scroll">
							<a class="prev">&lt;</a>
							<!--左右按钮-->
							<div class="items">
								<ul>
									<li v-for="(image,i) in images" th:key="i">
										<img :src="image" :bimg="image" onmousemove="preview(this)" />
									</li>
								</ul>
							</div>
							<a class="next">&gt;</a>
						</div>
					</div>
				</div>
				<div class="fr itemInfo-wrap">
					<div class="sku-name">
						<h4 v-text="sku.title"></h4>
					</div>
					<div class="news"><span th:utext="${spu.subTitle}">推荐选择下方[移动优惠购],手机套餐齐搞定,不用换号,每月还有花费返</span></div>
					<div class="summary">
						<div class="summary-wrap">
							<div class="fl title"><i>价　　格</i></div>
							<div class="fl price">
								<i>¥</i><em v-text="ly.formatPrice(sku.price)">5299.00</em><span>降价通知</span>
							</div>
							<div class="fr remark"><i>累计评价</i><em>612188</em></div>
						</div>
						<div class="summary-wrap">
							<div class="fl title">
								<i>促　　销</i>
							</div>
							<div class="fl fix-width">
								<i class="red-bg">加价购</i>
								<em class="t-gray">满999.00另加20.00元，或满1999.00另加30.00元，或满2999.00另加40.00元，即可在购物车换
购热销商品</em>
							</div>
						</div>
					</div>
					<div class="support">
						<div class="summary-wrap">
							<div class="fl title">
								<i>支　　持</i>
							</div>
							<div class="fl fix-width">
								<em class="t-gray">以旧换新，闲置手机回收  4G套餐超值抢  礼品购</em>
							</div>
						</div>
						<div class="summary-wrap">
							<div class="fl title">
								<i>配 送 至</i>
							</div>
							<div class="fl fix-width">
								<em class="t-gray">上海 <span>有货</span></em>
							</div>
						</div>
					</div>
					<div class="clearfix choose">
						<div id="specification" class="summary-wrap clearfix">
							<dl v-for="(val,key) in specialSpec" :key="key">
								<dt>
									<div class="fl title">
									<i>{{paramMap[key]}}</i>
								</div>
								</dt>

								<dd v-for="(v,i) in val" :key="i">
									<div :class="{notclick:IsDisabled(key,i)}" @click="clickSpecial(key,i)">
									<a href="javascript:;" :class="{selected:indexes[key] == i}" :style="IsDisabled(key,i)?mydotted:mysolid">
										{{v}}<span title="点击取消选择" v-if="i===indexes[key]">&nbsp;</span>
									</a>
									</div>
								</dd>
							</dl>
						</div>
						<div class="summary-wrap">
							<div class="fl title">
								<div class="control-group">
									<div class="controls">
										<input autocomplete="off" type="text" disabled v-model="num" value="1" minnum="1" class="itxt" />
										<a href="javascript:;" class="increment plus" @click="increment">+</a>
										<a href="javascript:;" class="increment mins" @click="decrement">-</a>
									</div>
								</div>
							</div>
							<div class="fl">
								<ul class="btn-choose unstyled">
									<li>
										<a href="javascript:;" target="_blank" class="sui-btn  btn-danger addshopcar" @click="addCart">加入购物车</a>
									</li>
								</ul>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--product-detail-->
			<div class="clearfix product-detail">
				<div class="fl aside">
					<ul class="sui-nav nav-tabs tab-wraped">
						<li class="active">
							<a href="#index" data-toggle="tab">
								<span>相关分类</span>
							</a>
						</li>
						<li>
							<a href="#profile" data-toggle="tab">
								<span>推荐品牌</span>
							</a>
						</li>
					</ul>
					<div class="tab-content tab-wraped">
						<div id="index" class="tab-pane active">
							<ul class="part-list unstyled">
								<li th:each="category : ${relatedCategories}">
									<a href="#" th:text="${category.name}">手机</a>
								</li>
								<!--<li>手机壳</li>
								<li>内存卡</li>
								<li>Iphone配件</li>
								<li>贴膜</li>
								<li>手机耳机</li>
								<li>移动电源</li>
								<li>平板电脑</li>-->
							</ul>
							<ul class="goods-list unstyled">
								<li v-for="goods in relatedGoods" :key="goods.id">
									<div class="list-wrap">
										<div class="items">
											<img :src="goods.skus[0].images" />
										</div>
										<div class="attr">
											<em><a :title="goods.skus[0].title"></a>{{goods.skus[0].title}}</em>
										</div>
										<div class="price">
											<strong>
												<em>¥</em>
												<i>{{ly.formatPrice(goods.skus[0].price)}}</i>
											</strong>
										</div>
										<div class="operate">
											<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
										</div>
									</div>
								</li>
								<!--<li>
									<div class="list-wrap">
										<div class="p-img">
											<img src="/img/_/part01.png" />
										</div>
										<div class="attr">
											<em>Apple苹果iPhone 6s (A1699)</em>
										</div>
										<div class="price">
											<strong>
											<em>¥</em>
											<i>6088.00</i>
										</strong>
										</div>
										<div class="operate">
											<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
										</div>
									</div>
								</li>
								<li>
									<div class="list-wrap">
										<div class="p-img">
											<img src="/img/_/part02.png" />
										</div>
										<div class="attr">
											<em>Apple苹果iPhone 6s (A1699)</em>
										</div>
										<div class="price">
											<strong>
											<em>¥</em>
											<i>6088.00</i>
										</strong>
										</div>
										<div class="operate">
											<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
										</div>
									</div>
								</li>
								<li>
									<div class="list-wrap">
										<div class="p-img">
											<img src="/img/_/part03.png" />
										</div>
										<div class="attr">
											<em>Apple苹果iPhone 6s (A1699)</em>
										</div>
										<div class="price">
											<strong>
											<em>¥</em>
											<i>6088.00</i>
										</strong>
										</div>
										<div class="operate">
											<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
										</div>
									</div>
									<div class="list-wrap">
										<div class="p-img">
											<img src="/img/_/part02.png" />
										</div>
										<div class="attr">
											<em>Apple苹果iPhone 6s (A1699)</em>
										</div>
										<div class="price">
											<strong>
											<em>¥</em>
											<i>6088.00</i>
										</strong>
										</div>
										<div class="operate">
											<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
										</div>
									</div>
									<div class="list-wrap">
										<div class="p-img">
											<img src="/img/_/part03.png" />
										</div>
										<div class="attr">
											<em>Apple苹果iPhone 6s (A1699)</em>
										</div>
										<div class="price">
											<strong>
											<em>¥</em>
											<i>6088.00</i>
										</strong>
										</div>
										<div class="operate">
											<a href="javascript:void(0);" class="sui-btn btn-bordered">加入购物车</a>
										</div>
									</div>
								</li>-->
							</ul>
						</div>
						<div id="profile" class="tab-pane">
							<ul class="part-list unstyled">
								<li th:each="brand : ${relatedBrands}">
									<a href="#" th:text="${brand.name}">手机</a>
									<!--<image th:src="${brand.image}"></image>-->
								</li>
							</ul>
						</div>
					</div>
				</div>
				<div class="fr detail">
					<div class="clearfix fitting">
						<h4 class="kt">选择搭配</h4>
						<div class="good-suits">
							<div class="fl master">
								<div class="list-wrap">
									<div class="p-img">
										<img src="/img/_/l-m01.png" />
									</div>
									<em>￥5299</em>
									<i>+</i>
								</div>
							</div>
							<div class="fl suits">
								<ul class="suit-list">
									<li class="">
										<div id="">
											<img src="/img/_/dp01.png" />
										</div>
										<i>Feless费勒斯VR</i>
										<label data-toggle="checkbox" class="checkbox-pretty">
    <input type="checkbox"><span>39</span>
  </label>
									</li>
									<li class="">
										<div id=""><img src="/img/_/dp02.png" /> </div>
										<i>Feless费勒斯VR</i>
										<label data-toggle="checkbox" class="checkbox-pretty">
    <input type="checkbox"><span>50</span>
  </label>
									</li>
									<li class="">
										<div id=""><img src="/img/_/dp03.png" /></div>
										<i>Feless费勒斯VR</i>
										<label data-toggle="checkbox" class="checkbox-pretty">
    <input type="checkbox"><span>59</span>
  </label>
									</li>
									<li class="">
										<div id=""><img src="/img/_/dp04.png" /></div>
										<i>Feless费勒斯VR</i>
										<label data-toggle="checkbox" class="checkbox-pretty">
    <input type="checkbox"><span>99</span>
  </label>
									</li>
								</ul>
							</div>
							<div class="fr result">
								<div class="num">已选购0件商品</div>
								<div class="price-tit"><strong>套餐价</strong></div>
								<div class="price">￥5299</div>
								<button class="sui-btn  btn-danger addshopcar">加入购物车</button>
							</div>
						</div>
					</div>
					<div class="tab-main intro">
						<ul class="sui-nav nav-tabs tab-wraped">
							<li class="active">
								<a href="#one" data-toggle="tab">
									<span>商品介绍</span>
								</a>
							</li>
							<li>
								<a href="#two" data-toggle="tab">
									<span>规格与包装</span>
								</a>
							</li>
							<li>
								<a href="#three" data-toggle="tab">
									<span>售后保障</span>
								</a>
							</li>
							<li>
								<a href="#four" data-toggle="tab">
									<span>商品评价</span>
								</a>
							</li>
							<li>
								<a href="#five" data-toggle="tab">
									<span>手机社区</span>
								</a>
							</li>
						</ul>
						<div class="clearfix"></div>
						<div class="tab-content tab-wraped">
							<div id="one" class="tab-pane active">
								<ul class="goods-intro-list unstyled" style="list-style: none;">
									<li>分辨率：1920*1080(FHD)</li>
									<li>后置摄像头：1200万像素</li>
									<li>前置摄像头：500万像素</li>
									<li>核 数：其他</li>
									<li>频 率：以官网信息为准</li>
									<li>品牌： Apple</li>
									<li>商品名称：APPLEiPhone 6s Plus</li>
									<li>商品编号：1861098</li>
									<li>商品毛重：0.51kg</li>
									<li>商品产地：中国大陆</li>
									<li>热点：指纹识别，Apple Pay，金属机身，拍照神器</li>
									<li>系统：苹果（IOS）</li>
									<li>像素：1000-1600万</li>
									<li>机身内存：64GB</li>
								</ul>
								<!--商品详情-->
								<div class="intro-detail" th:utext="${spuDetail.description}">
								</div>
							</div>
							<div id="two" class="tab-pane">
								<div class="Ptable">
    <div class="Ptable-item" v-for="(group,i) in groups" :key="group">
        <h3>{{group.name}}</h3>
        <dl>
			<div v-for="(p,j) in group.params" :key="j">
            	<dt>{{p.name}}</dt><dd>{{p.v+(p.unit||"")}}</dd>
			</div>
        </dl>
    </div>
</div>
<div class="package-list">
    <h3>包装清单</h3>
    <p th:text="${spuDetail.packingList}">手机X1、快速指南X1、华为SuperCharge 充电器X1、三包凭证X1、Type-C 数字耳机X1、Type-C 数据线X1、取卡针X1、TPU保护壳X1、USB Type-C转3.5mm耳机转接线X1（备注：最终以实物为准）</p>
</div>

							</div>
							<div id="three" class="tab-pane">
								<p th:text="${spuDetail.afterService}">售后保障</p>
							</div>
							<div id="four" class="tab-pane">
								<p>商品评价</p>
							</div>
							<div id="five" class="tab-pane">
								<p>手机社区</p>
							</div>
						</div>
					</div>
				</div>
			</div>
			<!--like-->
			<div class="clearfix"></div>
			<div class="like">
				<h4 class="kt">猜你喜欢<span style="width:500px"></span>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="javascript:void(0)" @click="changeSearch">换一批</a></h4>
				<div class="like-list">
					<ul class="yui3-g">
						<li class="yui3-u-1-6" v-for="goods in loveGoods" :key="goods.id">
							<div class="list-wrap">
								<div class="p-img">
									<img :src="goods.selected.image" />
								</div>
								<div class="attr">
									<em>{{goods.selected.title}}</em>
								</div>
								<div class="price">
									<strong>
											<em>¥</em>
											<i>{{ly.formatPrice(goods.selected.price)}}</i>
										</strong>
								</div>
								<div class="commit">
									<i class="command">已有6人评价</i>
								</div>
							</div>
						</li>
						<!--<li class="yui3-u-1-6">
							<div class="list-wrap">
								<div class="p-img">
									<img src="/img/_/itemlike02.png" />
								</div>
								<div class="attr">
									<em>Apple苹果iPhone 6s/6s Plus 16G 64G 128G</em>
								</div>
								<div class="price">
									<strong>
											<em>¥</em>
											<i>4388.00</i>
										</strong>
								</div>
								<div class="commit">
									<i class="command">已有700人评价</i>
								</div>
							</div>
						</li>
						<li class="yui3-u-1-6">
							<div class="list-wrap">
								<div class="p-img">
									<img src="/img/_/itemlike03.png" />
								</div>
								<div class="attr">
									<em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
								</div>
								<div class="price">
									<strong>
											<em>¥</em>
											<i>4088.00</i>
										</strong>
								</div>
								<div class="commit">
									<i class="command">已有700人评价</i>
								</div>
							</div>
						</li>
						<li class="yui3-u-1-6">
							<div class="list-wrap">
								<div class="p-img">
									<img src="/img/_/itemlike04.png" />
								</div>
								<div class="attr">
									<em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
								</div>
								<div class="price">
									<strong>
											<em>¥</em>
											<i>4088.00</i>
										</strong>
								</div>
								<div class="commit">
									<i class="command">已有700人评价</i>
								</div>
							</div>
						</li>
						<li class="yui3-u-1-6">
							<div class="list-wrap">
								<div class="p-img">
									<img src="/img/_/itemlike05.png" />
								</div>
								<div class="attr">
									<em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
								</div>
								<div class="price">
									<strong>
											<em>¥</em>
											<i>4088.00</i>
										</strong>
								</div>
								<div class="commit">
									<i class="command">已有700人评价</i>
								</div>
							</div>
						</li>
						<li class="yui3-u-1-6">
							<div class="list-wrap">
								<div class="p-img">
									<img src="/img/_/itemlike06.png" />
								</div>
								<div class="attr">
									<em>DELL戴尔Ins 15MR-7528SS 15英寸 银色 笔记本</em>
								</div>
								<div class="price">
									<strong>
											<em>¥</em>
											<i>4088.00</i>
										</strong>
								</div>
								<div class="commit">
									<i class="command">已有700人评价</i>
								</div>
							</div>
						</li>-->
					</ul>
				</div>
			</div>
		</div>
	</div>
</div>
<script src="/js/vue/vue.js"></script>
<script src="/js/axios.min.js"></script>
<script src="/js/common.js"></script>
<script th:inline="javascript">
	const skus = /*[[${skus}]]*/[];
	const categories = /*[[${categories}]]*/[];
	let key = "";
    for(var i=0;i<categories.length;i++){
        key += categories[i].name
	}
	const paramMap = /*[[${paramMap}]]*/{};
	const specialSpec = JSON.parse(/*[[${spuDetail.specialSpec}]]*/"")
    const genericSpec = JSON.parse(/*[[${spuDetail.genericSpec}]]*/"")
    const groups = /*[[${specGroups}]]*/ [];
	const indexes = {};
	Object.keys(specialSpec).forEach(key=>{
	    indexes[key]=0;
	})
    const relatedCategories = /*[[${relatedCategories}]]*/[];
    const loveGoods = /*[[${loveGoods}]]*/[];
    loveGoods.forEach(goods => {
        goods.skus = JSON.parse(goods.skus);
        goods.selected = goods.skus[1];
    })
    const partGoods = /*[[${partGoods}]]*/[];
    const relatedGoods = /*[[${relatedGoods}]]*/[];
    const relatedBrands = /*[[${relatedBrands}]]*/[];

</script>
<script>
    var itemVm = new Vue({
        el:"#itemApp",
        data:{
           skus,
			ly,
			paramMap,
			specialSpec,
			indexes,
            genericSpec,
			num:1,
            relatedCategories,
            loveGoods,
            partGoods,
            relatedGoods,
            relatedBrands,
			disabled: true,
            categories,
            search:{
                key,
                page:1,
                size:6
            },
			mysolid:{
               border:"1px solid #000",
				color:"black"
			},
			mydotted:{
                border:"1px dotted #CCC",
                color:"#DDD"
			}
        },
        components:{
            lyTop: () => import('/js/pages/top.js')
        },
		computed:{
            sku(){
                const index = Object.values(this.indexes).join("_");
                if(this.skus.find(s=>s.indexes==index)){
                    return this.skus.find(s=>s.indexes==index);
				} else {
                    return this.skus[0];
				};
			},
			images(){
                return this.sku.images?this.sku.images.split(","):"";
			},
			groups(){
                groups.forEach(group=>{
					group.params.forEach(param => {
					    if(param.generic){
							param.v=this.genericSpec[param.id]||"其他";
						}else{
					        param.v=JSON.parse(this.sku.ownSpec)[param.id]
						}
					})
				})
				return groups;
			},
			skusIndexes(){
                let skusIndexes = [];
                this.skus.forEach(sku=>{
                    const indexes = sku.indexes.split("_");
                    const keys = Object.keys(specialSpec);
                    const skuIndex = [];
                    for(var i=0;i<indexes.length;i++){
                        const index = {};
                        index[keys[i]] = indexes[i];
                        skuIndex.push(index);
					}
					skusIndexes.push(skuIndex);

				})
				return skusIndexes;
			}
		},
		watch:{
          search:{
              deep:true,
              handler(){
                  ly.http.post("/search/love",this.search).then(({data})=>{
                     data.forEach(goods => {
                         goods.skus = JSON.parse(goods.skus);
                         goods.selected = goods.skus[0];
                     })
					  this.loveGoods = data;
				  })
              }
		  }
		},
		methods:{
            increment(){
                this.num++;
			},
			decrement(){
                if(this.num > 1) {
                    this.num--;
                }
			},
			addCart() {
                ly.http.get("/auth/verify").then(resp=>{
					ly.http.post("/cart",{skuId:this.sku.id,num:this.num}).then(resp=>{
                        location.href="http://www.leyou.com/cart.html";
					})
				}).catch(()=>{
				    const carts = ly.store.get("carts") || [];
				    let cart = carts.find(cart=>cart.skuId==this.sku.id);
				    if(cart){
				        cart.num += this.num
					} else{
						carts.push({
                            skuId:this.sku.id,
                            title:this.sku.title,
                            image:this.images?this.images[0]:"",
                            price:this.sku.price,
                            num:this.num,
                            ownSpec:this.sku.ownSpec
						})
					}
					ly.store.set("carts",carts);
					location.href="http://www.leyou.com/cart.html";
				})
			},
            clickSpecial(key,i){
                if(this.indexes[key]==i){
                    console.log("2222")
                    delete this.indexes[key];
                    this.indexes = Object.assign({}, this.indexes);
                    return;
				}
              	if(Object.keys(this.specialSpec).length===Object.keys(this.indexes).length){
              	    const index = {};
              	    index[key] = i;
                    this.indexes = index;
                }else{
                    this.indexes[key]=i;
                    this.indexes = Object.assign({}, this.indexes);
                }
			},
			IsDisabled(key,i){
				const check={};
				Object.assign(check,this.indexes);
				check[key] = i;
				console.log(check)
                const keys = Object.keys(check);
                const values = Object.values(check);
                const indexes = []
                for(var i=0;i<keys.length;i++){
                    const index = {};
                    index[keys[i]] = values[i].toString();
                    indexes.push(index);
                }
                return (!this.isInclude(this.skusIndexes,indexes))&&(Object.keys(this.specialSpec).length!=Object.keys(this.indexes).length);
			},
            isInclude(arr1,arr2){
                var flag = false;
                for(var i=0;i<arr1.length;i++){
                    const a = arr1[i];
                    for(var j=0;j<arr2.length;j++){
                        const obj = arr2[j];
                        if(JSON.stringify(a).indexOf(JSON.stringify(obj)) === -1){
                            //console.log('不存在')
							flag = false;
							break;
                        }else{
                            //console.log('已存在')
							flag = true;
                        }
					}
                    if(flag){
                        return true;
                    }
				}
				return false;
			},
            changeSearch(){
				this.search.page++;
			},
            /*deselect(key){
                console.log("11111111")
                delete this.indexes.key;
                this.indexes = Object.assign({}, this.indexes)
            }*/
		},

		created() {
            //添加我的足迹
            ly.http.post("/favorite/track", {
                skuId: this.sku.id,
                cname: this.categories[this.categories.length - 1].name
            }).then(res => {

            })
        }
    });
</script>

<script type="text/javascript" src="/js/plugins/jquery/jquery.min.js"></script>
<script type="text/javascript">

	$(function(){
	$("#service").hover(function(){
		$(".service").show();
	},function(){
		$(".service").hide();
	});
	$("#shopcar").hover(function(){
		$("#shopcarlist").show();
	},function(){
		$("#shopcarlist").hide();
	});

})

</script>
<script type="text/javascript" src="/js/model/cartModel.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.easing/jquery.easing.min.js"></script>
<script type="text/javascript" src="/js/plugins/sui/sui.min.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.jqzoom/jquery.jqzoom.js"></script>
<script type="text/javascript" src="/js/plugins/jquery.jqzoom/zoom.js"></script>
<script type="text/javascript" src="index/index.js">
</script>


<script th:inline="javascript">
    const a = /*[[${specGroups}]]*/ [];
    const b = /*[[${paramMap}]]*/ [];
    const c = /*[[${categories}]]*/ [];
    const d = /*[[${spu}]]*/ {};
    const e = /*[[${spuDetail}]]*/ {};
    const f = /*[[${skus}]]*/ [];
    const g = /*[[${brand}]]*/ {};
</script>
</body>
</html>